<template>
	<view>
		<!-- <cu-custom bgColor="bg-gradual-pink" :isBack="true">
					<block slot="backText">返回</block>
					<block slot="content">联系记录</block>
				</cu-custom> -->
				<u-navbar :border-bottom="false" title="联系记录" back-icon-color="#ffffff" :background="{background:'#2149c3'}" title-color="#ffffff"></u-navbar>
		<form>
			<view class="cu-form-group">
				<view class="title">联系时间<text class="required">*</text></view>
				<view style="width: 80%;height: 100rpx;line-height: 100rpx;" class="picker" @tap="handleTap('picker5')">
					{{relationshipTime}}
				</view>
				
			</view>
			<view class="item">
				<e-picker-plus verify ref="picker5" mode="YMDhms" @confirm="confirm" />
			</view>
			
			<view class="cu-form-group margin-top">
				<view class="title">联系人<text class="required">*</text></view>
				<input maxlength="10" v-model="relationshipUser" placeholder="请填写联系人" name="input"></input>
			</view>
			<view class="cu-form-group">
				<view class="title">联系结果<text class="required">*</text></view>
				<textarea maxlength="100" v-model="relationshipResult" placeholder="请填写联系结果"></textarea>
			</view>
			<view class="cu-form-group margin-top">
				<view class="title">备注</view>
				<textarea maxlength="100" v-model="relationshipRemark" placeholder="请填写联系记录"></textarea>
			</view>
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue margin-tb-sm lg" @click="submitRecord()">提交</button>
			</view>
		</form>		
	</view>
</template>

<script>
	var _self;
	import {
		mapState,
		mapMutations
	} from 'vuex';	
	// @/colorui/components/e-picker-plus/e-picker-plus.vue
	import ePickerPlus from "../components/colorui/components/e-picker-plus/e-picker-plus.vue";
	export default {
			components: {
				ePickerPlus
			},
			computed: {
				...mapState(['userInfo', 'hasLogin', 'loginProvider', 'openid'])
			},
			data() {
				return {
					relationshipTime: '',
					relationshipUser: '',
					relationshipResult: '',
					relationshipRemark: '',
					customerId: '',
				};
			},
			onLoad(e){
				_self = this;
				this.customerId = e.customerId;
			},
			methods: {
				...mapMutations(['login', 'logout', 'setOpenid', 'setProvider']),
				
				handleTap(ref) {
					this.$refs[ref].show()
				},
				confirm(e) {
					//console.log(e)
					this.relationshipTime = e.result;
				},
				submitRecord : function(){
					if(this.relationshipTime.length<1){
						uni.showToast({ title: "联系时间不能为空", icon: "none" });
						return;
					}
					if(this.relationshipUser.length<1){
						uni.showToast({ title: "联系人不能为空", icon: "none" });
						return;
					}
					if(this.relationshipResult.length<1){
						uni.showToast({ title: "联系结果不能为空", icon: "none" });
						return;
					}
					uni.showLoading({});
				    uni.request({
				    	url: this.serverUrl + 'app/addRecord',
				    	header: {
				    		"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
				    	},
				    	method: 'POST',
				    	data: {
				    		relationshipTime: this.relationshipTime,
							relationshipUser: this.relationshipUser,
							relationshipResult: this.relationshipResult,
							relationshipRemark: this.relationshipRemark,
							customerId: this.customerId,
				    	},
				    	success: (r) => {
							// console.log(r);
				    		if (r.data.code==1) {
								uni.showToast({
									title: '提交成功',
									icon: 'none'
								})
								setTimeout(function() {
									uni.navigateBack({
										delta:1,
										success(e) {
											var page = getCurrentPages().pop(); 
											if (page == undefined || page == null) return; 
											page.onLoad({
												customerId:_self.customerId
											}); 
										}
									})
								}, 200)
							}
						},complete(r) {
							uni.hideLoading();
						}
					})
				}
				
			}
		}
</script>

<style>
	.required{
		color: red;
	}
	.padding{
		text-align: center;
	}
	.cu-form-group .title{
		width: 170rpx;
	}
	
</style>
